import { Descriptions, List } from "antd";
import moment from "moment";
import React from "react";

export interface UserActionProps {
  userInfo: API.GetUserInfoDto;
}

const UserAction: React.FC<UserActionProps> = ({ userInfo }) => {
  return (
    <List
      itemLayout="vertical"
      size="large"
      pagination={{
        pageSize: 10,
      }}
      dataSource={userInfo.actions}
      renderItem={(action) => {
        return (
          <List.Item>
            <Descriptions title={action.info}>
              <Descriptions.Item label="设备信息">
                {action.platform}
              </Descriptions.Item>
              <Descriptions.Item label="IP">{action.ip}</Descriptions.Item>
              <Descriptions.Item label="创建时间">
                {moment(action.createdAt).format("YYYY-MM-DD HH:mm:ss")}
              </Descriptions.Item>
            </Descriptions>
          </List.Item>
        );
      }}
    />
  );
};

export default UserAction;
